<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" /> 
    <link rel="stylesheet" href="app.css" type="text/css" />
    <script src="jquery.js"></script> 
    <script src="lodash.js"></script> 
</head>
<body>

    <div id="ClickTest"><h1><a href="javascript:;"> Click To Start Testing.</a></h1></div>

    <div><h3>Test is sub menu of parent by position.</h3></div>
    <div id="submenucontainera">
        <div>
            <a href="javascript:;" id="submenuaaa">aaa</a>
        </div>
        <div class="submenu">
            <div class="inner">
                <a href="javascript:;" id="submenudiv">bbb</a>
                <a href="javascript:;" id="submenudiv2">ccc</a>
            </div>
        </div>
        <div><a href="javascript:;">ddd</a></div>
    </div>

    <div> ----- </div>
    <div><a href="#" id="subfaraway">far away link.</a></div>

    <div><h3>get direct sub links.</h3></div>

    <ul>
        <li class="top-menu" id="directsublinkcontainer">
            <a href="javascript:;" id="directsublinkparent">About Us</a>
            <ul class="sub-menu non-active">
                <li><a href="javascript:;">subone</a></li>
                <li id="directsubtwocontainer">
                    <a href="javascript:;" id="directsubtwo">subtwo</a>
                    <ul class="sub-menu non-active">
                        <li><a href="javascript:;">subsubone</a></li>
                        <li><a href="javascript:;">subsubtwo</a></li>
                    </ul>
                </li>
            </ul>
        </li>

        <li class="top-menu">
            <a href="#">About them</a>
            <ul class="sub-menu non-active">
                <li><a href="javascript:;">we</a></li>
                <li><a href="javascript:;">who</a></li>
            </ul>
        </li>

    </ul>

    <div><h3>regular menus</h3></div>

    <ul>
        <li id="regularmenu"><a href="javascript:;">aaa</a></li>
        <li id="regularmenubbbb"><a href="javascript:;">bbb</a></li>
        <li id="regularmenucccc"><a href="javascript:;">ccc</a></li>
    </ul>

    <div><h3>Menu with direct sub links...</h3></div>

    <ul id="directsubmenu_ul">
        <li>
            <a href="javascript:;" id="linkwithdirectsubmenu">aaa</a>
            <ul>
                <li>
                    <a href="javascript:;">subone</a>
                    <ul>
                        <li><a href="javascript:;">sub2one</a></li>
                        <li><a href="javascript:;">sub2two</a></li>
                    </ul>
                </li>
                <li><a href="javascript:;">sub two</a></li>
            </ul>
        </li>

        <li><a href="javascript:;" id="nosubmenulinks">bbb</a></li>

        <li><a href="javascript:;">ccc</a></li>

    </ul>


    <div><h3>menu with div as container</h3></div>
    <div>
        <div>
            <a href="javascript:;">aaa</a>
        </div>
        <div class="submenu"><a href="javascript:;">bbb</a></div>
        <div>
            <a href="javascript:;">ccc</a>
        </div>
        <div class="submenu"><a href="javascript:;">ddd</a></div>
    </div>

    <div>menu with div sibling sub menu.</div>
    <div>
        <div>
            <a href="javascript:;">aaa</a>
        </div>

        <div class="submenu">
            <div style="padding:10px;">
                <a href="javascript:;">sub one</a>
                <a href="javascript:;">sub two</a>
            </div>
        </div>

        <div><a href="javascript:;">bbb</a></div>

        <div class="submenu">
            <div style="padding:10px;">
                <a href="javascript:;">sub one</a>
                <a href="javascript:;">sub two</a>
            </div>
        </div>

    </div>


    <div>menu with javascript mouseover submenu..</div>

    <ul>
        <li class="top-menu">
            <a href="javascript:;">About Us</a>
            <ul class="sub-menu non-active">
                <li><a href="javascript:;">Ashley</a></li>
                <li><a href="javascript:;">David</a></li>
            </ul>
        </li>

        <li class="top-menu">
            <a href="#">About them</a>
            <ul class="sub-menu non-active">
                <li><a href="javascript:;">we</a></li>
                <li><a href="javascript:;">who</a></li>
            </ul>
        </li>

    </ul>

    <div><h3>menu with div container.</h3></div>

    <div class="classifybox" id="prochannelId46110">
        <div>
            <div class="left title">
                <a id="divmenuwithonesubitem" href="http://www.haier.com/cn/consumer/cooling/">冰箱专区</a><span>　</span>
            </div>
            <ul class="left ">
                <li><a href="http://www.haier.com/cn/consumer/cooling/cplb/index.shtml?sx=LEIBIE%5E6723%5E%u7BB1%u95E8%u7ED3%u6784%5E%u5355%u95E8%u51B0%u7BB1%5Ecn_bing_xiang">单门冰箱</a></li>
                <li><span>|</span><a href="http://www.haier.com/cn/consumer/cooling/cplb/index.shtml?sx=LEIBIE%5E6723%5E%u7BB1%u95E8%u7ED3%u6784%5E%u4E24%u95E8%u51B0%u7BB1%5Ecn_bing_xiang">两门冰箱</a></li>
                <li><span>|</span><a href="http://www.haier.com/cn/consumer/cooling/cplb/index.shtml?sx=LEIBIE%5E6723%5E%u7BB1%u95E8%u7ED3%u6784%5E%u4E09%u95E8%u51B0%u7BB1%5Ecn_bing_xiang">三门冰箱</a></li>
                <li><span>|</span><a href="http://www.haier.com/cn/consumer/cooling/cplb/index.shtml?sx=LEIBIE%5E6723%5E%u7BB1%u95E8%u7ED3%u6784%5E%u5BF9%u5F00%u95E8%u51B0%u7BB1%5Ecn_bing_xiang">对开门冰箱</a></li>
                <li><span>|</span><a href="http://www.haier.com/cn/consumer/cooling/cplb/index.shtml?sx=LEIBIE%5E6723%5E%u7BB1%u95E8%u7ED3%u6784%5E%u591A%u95E8%u51B0%u7BB1%5Ecn_bing_xiang">多门冰箱</a></li>
            </ul>
            <div clas="clear"></div>
        </div>
        <div>
            <div class="left title">
                <a href="http://www.haier.com/cn/consumer/ice_bar/">冰吧酒柜专区</a><span>　</span>
            </div>
            <ul class="left ">
                <li><a href="http://www.haier.com/cn/consumer/ice_bar/allLg/index.shtml">冰吧酒柜</a></li>
            </ul>
            <div clas="clear"></div>
        </div>
    </div>

    <div><h3>Get menu under container</h3></div>

    <div id="menucontainer">
        <ul>
            <li>
                <a href="/aaa">aaa</a>
                <ul>
                    <li>
                        <a href="/subone">subone</a>                       
                    </li>
                    <li><a href="/subtwo">subtwo</a></li>
                </ul>
            </li>

            <li><a href="/bbb">bbb</a></li>

            <li><a href="/ccc">ccc</a></li>
        </ul>
        <div> some other text</div>
    </div>

    <div><h3>Get menu with related value</h3></div>

    <div id="relatedmenu">
        <ul>
            <li><a href="/aaa" id="relatedwithsub" subitem="xxx">aaa</a> 
            </li> 
            <li><a href="/bbb">bbb</a></li> 
        </ul>
        <div parent="xxx"><a href="/subone">one</a><a href="/subtwo">two</a></div>
    </div>


    <div><h3>external or category links no menu</h3></div>

    <div id="externallinks">
        <ul>
            <li>
                <a href="http://www.google.com">aaa</a>
            </li>
            <li><a href="/http://www.baidu.com">bbb</a></li>
        </ul>
    </div>

    <div id="categorylinks">
        <ul>
            <li>
                <a href="/page/aaa">aaa</a>
            </li>
            <li><a href="/page/bbb">bbb</a></li>
        </ul>
    </div>

    <div><h3>regular menu convert result</h3></div>

    <ul>
        <li><a id="regularConvert" href="/lineone">aaa</a></li>
        <li><a href="/linktwo">bbb</a></li>
        <li><a href="/linkthree">ccc</a></li>
    </ul>   <ul>
        <li><a id="regularConvert" href="/lineone">aaa</a></li>
        <li><a href="/linktwo">bbb</a></li>
        <li><a href="/linkthree">ccc</a></li>
    </ul>

    <ul>
        <li kooboo-id="2-1-5-5-3" data-kb-fe-id="58"><a id="regularConvertWithId" href="/lineone">aaa</a></li>
        <li kooboo-id="2-1-5-5-3" data-kb-fe-id="58"><a href="/linktwo">bbb</a></li>
        <li kooboo-id="2-1-5-5-3" data-kb-fe-id="58"><a href="/linkthree">ccc</a></li>
    </ul>
     
</body>
<script src="js/require.js" data-main="MenuUnitTest.js"></script> 
</html>
